﻿<div class="theme">
    <div ss:theme="Lightness" style="background-color:#F5AD37"></div><div ss:theme="Darkness" style="background-color:#4E4E4E"></div><div ss:theme="Start" style="background-color:#63B2D2"></div><div ss:theme="Redmond" style="background-color:#70A7D1"></div><div ss:theme="Sunny" style="background-color:#999283"></div><div ss:theme="Overcast" style="background-color:#DFDFDF"></div><div ss:theme="Le Frog" style="background-color:#3C8206"></div><div ss:theme="Flick" style="background-color:#DFDFDF"></div><div ss:theme="Pepper Grinder" style="background-color:#F8F8F8"></div><div ss:theme="Eggplant" style="background-color:#3F3749"></div><div ss:theme="Dark Hive" style="background-color:#616161"></div>
</div>
<script type="text/javascript">
    $(function () {
        // apply theme
        var applyTheme = function (theme) {
            $('link#theme').attr('href', $format(
                '{0}{1}/{2}',
                '@Url.Content("~/Content/themes/")', theme, 'jquery-ui.custom.css'));
            $('.theme > div').removeClass('active').filter(function () { return $(this).attr('ss:theme') == theme; }).addClass('active');
        };
        // restore theme
        var theme = $getCookie('theme');
        if (theme != null && theme.length > 0) { applyTheme(theme); }
        // bind events
        var buttons = $('.theme div').addClass('ui-corner-all');
        buttons.each(function () { $(this).attr('title', $(this).attr('ss:theme')); });
        buttons.click(function () {
            var theme = $(this).attr('ss:theme');
            applyTheme(theme);
            // save selected theme
            $setCookie('theme', theme, 100);
        });
    });
</script>